<template>
	<view>
		<uNavbar title="我的拼手机" bgColor="transparent"></uNavbar>
		<view class="wrap" >
			<view class="wrapitem" v-for="item in list" :key="item.id" @click="go(item.category_id)">
				<image :src="item.category_cover" mode=""></image>
				<text class="texts1">{{item.category_name}}</text>
				<text class="texts2">{{item.assembled_count}}/{{item.count}}</text>
			</view>

		</view>
		<view class="main" @click="gojysc">
			<image src="/static/image/jysc2.png" mode=""></image>
			<text>交易市场</text>
		</view>
		<view class="main" @click="gojfdl">
			<image src="/static/image/jfdl2.png" mode=""></image>
			<text>完拼队列</text>
		</view>
	<!-- 	<view class="main" @click="gocjjf">
			<image src="/static/image/cjjf.png" mode=""></image>
			<text>超级交付</text>
		</view> -->
		<view class="main"  v-if="winning_lottery" @click="gowdjf">
			<image src="/static/image/wdjf2.png" mode=""></image>
			<text>我的交付</text>
		</view>
		<view class="main" @click="gophcq"  >
			<image src="/static/image/phcq2.png" mode=""></image>
			<text>我的完拼卡</text>
		</view>
		<view class="main" @click="gowqhg" >
			<image src="/static/image/wqhg2.png" mode=""></image>
			<text>往期回顾</text>
		</view>
		<view class="main" @click="gocxpc" >
			<image src="/static/image/cpxj.png" mode=""></image>
			<text>重拼新机</text>
		</view>
	</view>
</template>

<script>
	import {
		phonenav,phoneindex
	} from "../../api/myphone.js"
	export default {
		data() {
			return {
				list: [],
				id: "",
				installmentId:'',
				isCan:null,
				is_allocation:false,
				is_winning:false,
				winning_lottery:false
			}
		},
		onShow() {
			this.getid()
		},
		methods: {
			getid() {
				phoneindex().then(res => {
					this.id = res.data.member_phone.phone_id
					this.installmentId = res.data.member_phone.installment_id
					this.isCan=res.data.member_phone.status
					this.is_allocation=res.data.is_allocation
					this.is_winning=res.data.is_winning
					this.winning_lottery=res.data.winning_lottery
					this.getinfo()
					console.log(this.id, "asdasd")
				})
			},
			getinfo() {
				phonenav({
					phone_id: this.id
				}).then(res => {
					this.list = res.data
				})
			},
			go(id) {
				uni.navigateTo({
					url: "/pagesMy/nationalPhonePooling/myPhonePoolingdetail?id="+id
				})
			},
			gojysc() {
				uni.navigateTo({
					url: "/pagesMy/nationalPhonePooling/tradingMarket"
				})
			},
			gojfdl() {
				uni.navigateTo({
					url: "/pagesMy/nationalPhonePooling/deliveryQueue"
				})
			},
			gocjjf() {
				//状态0-拼车中；1-拼车完成；2-待交付；3-已交车，4拼车失败，5未抽中，6完成


				 	uni.navigateTo({
					
						url: "/pagesMy/nationalPhonePooling/superDelivery"
				 	})

			},
			gophcq() {
				uni.navigateTo({
					url: "/pagesMy/nationalPhonePooling/numberAllocation"
				})
			},
			gowdjf() {
				//状态0-拼车中；1-拼车完成；2-待交付；3-已交车，4拼车失败，5未抽中，6完成
					
					uni.navigateTo({
						url: "/pagesMy/nationalPhonePooling/myDelivery"
					})
				
			},
			gowqhg(){
				uni.navigateTo({
					url:"/pagesMy/nationalPhonePooling/previousReview?id="+this.installmentId
				})
			},
			gocxpc(){
				uni.navigateTo({
					url:"/pagesMy/nationalPhonePooling/anewPhone"
				})
			}
		},
	}
</script>
<style>
	/* page {
		background: #10191F !important;
	} */
</style>
<style scoped lang="scss">
	/deep/ .u-navbar__content__title {
		color:#333333 !important;
	}

	/deep/.uicon-arrow-left {
		color:#333333 !important;
	}

	.wrap {
		width: 750rpx;
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
		align-items: center;
		
		.wrapitem {
			width: 332rpx;
			height: 124rpx;
			margin-top: 20rpx;
			position: relative;
			background: #F2F2F2;
			>image {
				position: absolute;
				top: 20rpx;
				left: 50rpx;
				width:76rpx;
				height:76rpx;
			}

			.texts1 {
				position: absolute;
				top: 20rpx;
				right: 40rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #A68A64;
			}

			.texts2 {
				width: 100rpx;
				position: absolute;
				bottom: 20rpx;
				right: 50rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #A68A64;
				text-align: center;
			}
		}
	}

	.main {
		width: 690rpx;
		height: 80rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background:#F2F2F2 ;
		>image {
			width: 40rpx;
			height: 38rpx;
		}

		>text {
			font-weight: 500;
			font-size: 36rpx;
			color:#A68A64;
			margin-left: 10rpx;
		}
	}
</style>